<!DOCTYPE html>
<html xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <title>BIN卡查询</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="/3nod_web/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/3nod_web/layui/css/soulTable.css" media="all"/>
    <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>
<body>
<!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<script type="text/css">
    #tablesReload{height: 500px}
</script>
<div class="layui-container" style="width: 90%;">
    <div class="layui-row">
        <div class="layui-col-md2" style="text-align: center;">
            <form class="layui-form" action="" id="myform">
                <div>
                    <div class="layui-form-item" style="margin-top: 20px; ">

                        <div class="layui-inline ">
                            <label class="layui-form-label">货主</label>
                            <div class="layui-input-inline " style="width: 168px;">
                                <select name="storerkey" lay-filter="storerkey" id="storerkey" lay-verify="required">
                                </select>
                            </div>
                        </div>

                        <div class="layui-inline">
                            <label class="layui-form-label">起始期别</label>
                            <div class="layui-input-inline" style="width:168px;">
                                <input type="text" name="startTime" id="startTime" autocomplete="off" class="layui-input" placeholder="yyyy-MM-dd" lay-verify="required" lay-reqtext="起始日期必填"
                                       th:value="${startTime}"
                                >
                            </div>
                        </div>

                        <div class="layui-inline">
                            <label class="layui-form-label">货品</label>
                            <div class="layui-input-inline" style="width:168px;">
                                <input type="text" name="sku" id="sku" autocomplete="off" class="layui-input">
                            </div>
                        </div>

                        <div class="layui-inline ">
                            <label class="layui-form-label">逻辑仓</label>
                            <div class="layui-input-inline " style="width: 168px;">
                                <select name="storerkey" lay-filter="lottable01" id="lottable01" lay-verify="required" lay-search>
                                    <option value="">请选择</option>
                                </select>
                            </div>
                        </div>


                        <div class="layui-inline ">
                            <label class="layui-form-label">储位</label>
                            <div class="layui-input-inline " style="width: 168px;">
                                <select name="storerkey" lay-filter="lottable02" id="lottable02" lay-search>
                                    <option value="">请选择</option>
                                </select>
                            </div>
                        </div>

                        <div class="layui-inline">
                            <label class="layui-form-label">批次</label>
                            <div class="layui-input-inline" style="width:168px;">
                                <input type="text" name="sku" id="lottable03" autocomplete="off" class="layui-input">
                            </div>
                        </div>

                        <div class="layui-inline">
                            <label class="layui-form-label">制造日期</label>
                            <div class="layui-input-inline" style="width:168px;">
                                <input type="text" name="startTime" id="lottable04" autocomplete="off" class="layui-input" placeholder="yyyy-MM-dd"
                                       th:value="${lottable04}"
                                >
                            </div>
                        </div>



                        <div class="layui-inline ">
                            <label class="layui-form-label">库位</label>
                            <div class="layui-input-inline " style="width: 168px;">
                                <select name="storerkey" lay-filter="loc" id="loc" lay-search>
                                    <option value="">请选择</option>
                                </select>
                            </div>
                        </div>

                        <div class="layui-inline" style="margin-top: 20px;margin-right: 80px;">
                            <button id="search" type="submit" lay-submit=""  lay-filter="search" class="layui-btn layui-btn-lg layui-btn-primary layui-btn-radius">搜索</button>
                            <button type="button" class="layui-btn" id="insert">执行</button>
                        </div>
                    </div>
                </div>
            </form>
        </div>
        <div class="layui-col-md10">
            <div class="layui-col-md12" style="margin-top: 20px;">
                <table class="layui-table" id="tables" lay-filter="tables"></table>
            </div>
            <div class="layui-col-md12" >
                <table class="layui-table" id="detail" lay-filter="detail"></table>
            </div>
        </div>
    </div>
</div>

<script src="/3nod_web/layui/layui.js" charset="utf-8"></script>
<script src="/3nod_web/js/jquery-1.8.3.js" charset="utf-8"></script>

<!--<script type="text/html" id="toolbarExcel">-->
    <!--<div class="layui-btn-container">-->
        <!--<a href="/3nod_web/exportBinitrnList">-->
            <!--<button class="layui-btn layui-btn-sm" lay-event="getCheckData" >全部导出</button>-->
        <!--</a>-->
    <!--</div>-->
<!--</script>-->

<script type="text/html" id="toolbar">
    <div class="layui-btn-container">
        <a href="/3nod_web/exportBinitrnList">
            <button class="layui-btn layui-btn-sm" lay-event="getCheckData" >全部导出</button>
        </a>

        <!--<button type="button" class="layui-btn layui-btn-primary" onclick="scorePDF()">打印</button>-->
    </div>
</script>
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
<script>
    layui.use(['table','laydate','form'],function () {
        var table = layui.table
            ,laydate = layui.laydate
            ,form = layui.form;

        // 为下拉框绑定值
        BindSelect();

        $("#insert").click(function(){
            $.get("/3nod_web/fileImport/insert");
        });


        // 选择货主后重新查询逻辑仓
        form.on('select(storerkey)', function(data){
            var storerkey = data.value; //得到被选中的值
            //逻辑仓
            $.get("/3nod_web/ytBinitrn/getWhcode?storerkey=" + storerkey,function (res) {
                $("#lottable01").html("").append("<option value=\"\">请选择</option>");
                for(var i =0;i<res.data.length;i++){
                    $("#lottable01").append("<option value=\""+res.data[i].whcode+"\">"+res.data[i].whcodename+"</option>");
                }

                //重新渲染
                layui.form.render("select");

            });
        });


        // 获取当前日期
        var myDate = new Date;
        // 获取当前年
        var year = myDate.getFullYear(); //获取当前年
        // 获取当前月
        var mon = myDate.getMonth()+1; //获取当前月
        // 如果月份小于10,则加0
        if(mon < 10){
            mon = "0" + mon;
        }

        // 组合默认日期
        var dnewate = year+"-"+mon+"-01";

        //执行一个laydate实例
        laydate.render({
            elem: '#startTime'//指定元素
            ,value: dnewate // 设置默认值
            ,btns: ['now','confirm']
        });
        //执行一个laydate实例
        laydate.render({
            elem: '#lottable04'//指定元素
        });

        //方法级渲染
        table.render({
            elem: '#tables'
            , url: '/3nod_web/ytBinitrn/itrnSummarizingList/'
            , height: 200
            , cols: [
                [
                    {field: 'storerkey', title: '货主', sort: true,}
                    , {field: 'sku', title: '货品', sort: true,}
                    , {field: 'descr', title: '说明',}
                    , {field: 'default6', title: '规格', width: 150}
                    , {field: 'uom', title: '基础单位'}
                    , {field: 'inceptionqty', title: '期初库存量'}
                    , {field: 'qty', title: '现库存量'}
                ]
            ]
            , id: 'tablesReload'
            , page: true
            , where: {storerkey: '1'} //使表格初始化为空
            , limits: [10,20, 50, 100, 200, 500, 1000, 2000, 3000, 4000, 5000]
            , limit: 10
        });

        //方法级渲染
        table.render({
            elem: '#detail'
            , url: '/3nod_web/ytBinitrn/binitrnList/'
            , height: 550
            , toolbar: '#toolbar'
            , cols: [
                [
                    {type: 'checkbox', fixed: 'left'}
                    ,{field: 'effectivedate', title: '异动日期', sort: true, width: 160}
                    , {field: 'type', title: '单据类型', sort: true,width: 120}
                    , {field: 'lottable02', title: '储位',width: 80}
                    , {field: 'loc', title: '库位',width: 120}
                    , {field: 'sku', title: '货品',width: 100}
                    , {field: 'descr', title: '说明',width: 100}
                    , {field: 'qty', title: '数量',width: 80}
                    , {field: 'balanceqty', title: '结存量',width: 80}
                    , {field: 'uom', title: '单位',width: 60}
                    , {field: 't100no', title: 'T100 单号',width: 120}
                    , {field: 't100fankuino', title: 'T100 反馈单号',width: 120}
                    , {field: 'workorderno', title: '工单单号',width: 120}
                    , {field: 'wmsno', title: 'WMS 单号',width: 120}
                    , {field: 'trantype', title: '活动', sort: true,width: 100}
                    , {field: 'lot', title: '批号',width: 120}
                ]
            ]
            , id: 'detailReload'
            , page: true
            , where: {storerkey: '1'} //使表格初始化为空
            , limits: [20, 50, 100, 200, 500, 1000, 2000, 3000, 4000, 5000]
            , limit: 20
        });

        var active = {
            reload: function () {
                var sku = $('#sku');
                var loc = $("#loc");
                var storerkey = $('#storerkey');
                var startTime = $('#startTime');
                var lottable01 = $('#lottable01');
                var lottable02 = $('#lottable02');
                var lottable03 = $('#lottable03');
                var lottable04 = $('#lottable04');

                //执行重载
                table.reload('tablesReload', {
                    page: {
                        curr: 1 //重新从第 1 页开始
                    }
                    , where: {
                        storerkey: storerkey.val(),
                        startTime: startTime.val(),
                        sku: sku.val(),
                        lottable01: lottable01.val(),
                        lottable02: lottable02.val(),
                        lottable03: lottable03.val(),
                        lottable04: lottable04.val(),
                        loc: loc.val()
                    }
                }, 'data');

                //执行重载
                table.reload('detailReload', {
                     page: {
                        curr: 1 //重新从第 1 页开始
                    }
                    , where: {
                        storerkey: storerkey.val(),
                        startTime: startTime.val(),
                        sku: sku.val(),
                        lottable01: lottable01.val(),
                        lottable02: lottable02.val(),
                        lottable03: lottable03.val(),
                        lottable04: lottable04.val(),
                        loc: loc.val()
                    }
                }, 'data');

            }
        };

        // $('#search').on('click', function () {
        //     active['reload'] ? active['reload'].call(this) : '';
        // });

        //监听提交
        form.on('submit(search)', function(data){
            active['reload'] ? active['reload'].call(this) : '';
            return false;
        });
    });

    //下拉框绑定值
    function BindSelect(){
        $.ajaxSettings.async = false;
        var storerkey;

        //货主
        $.get("/3nod_web/report/getShipper",function (res) {
            storerkey = res.data[0];

            for(var i =0;i<res.data.length;i++){
                $("#storerkey").append("<option value=\""+res.data[i]+"\">"+res.data[i]+"</option>");
            }

            //重新渲染
            layui.form.render("select");
        });

        $.ajaxSettings.async = true;

        //逻辑仓
        $.get("/3nod_web/ytBinitrn/getWhcode?storerkey=" + storerkey,function (res) {
            for(var i =0;i<res.data.length;i++){
                $("#lottable01").append("<option value=\""+res.data[i].whcode+"\">"+res.data[i].whcodename+"</option>");
            }

            //重新渲染
            layui.form.render("select");

        });

        //储位
        $.get("/3nod_web/ytBinitrn/getLoc?putawayzone=OUT",function (res) {
            for(var i =0;i<res.data.length;i++){
                $("#lottable02").append("<option value=\""+res.data[i].loc+"\">"+res.data[i].loc+"</option>");
            }

            //重新渲染
            layui.form.render("select");

        });

        //库位
        $.get("/3nod_web/ytBinitrn/getLoc",function (res) {
            for(var i =0;i<res.data.length;i++){
                $("#loc").append("<option value=\""+res.data[i].loc+"\">"+res.data[i].loc+"</option>");
            }

            //重新渲染
            layui.form.render("select");

        });
    };
    // 打印
    function scorePDF (argument) {
        layui.use('table',function(){
            var table = layui.table
            var checkStatus = table.checkStatus('detailReload');
            var frame = document.createElement("IFRAME");
            if(checkStatus.data.length==0){
                parent.layer.msg('请先选择要打印的数据行！', {icon: 2});
                return ;
            }
            var nums = "";
            for(var i=0;i<checkStatus.data.length;i++){
                nums += checkStatus.data[i].loc+",";
            }
            //parent.layer.msg('打印中...', {icon: 16,shade: 0.3,time:5000});

            frame.style.display ="none";
            frame.src = "/3nod_web/ytBinitrn/scorePDF?nums="+nums;//controller层的url
            document.body.appendChild(frame);
            frame.contentWindow.focus();
            frame.contentWindow.print();
        });
    }
</script>

</body>
</html>